<!doctype html>
<html lang="en">
<head>
    <% include head.ejs %>
    <link rel="stylesheet" href="/css/loading.css"/>
    <link rel="stylesheet" href="/css/mukeproduct.css"/>
</head>
<body>
<% include second_nav.ejs %>
<style>
    body {
        padding-top: 70px;
    }
    .container {
        max-width: 990px !important;
    }
    form {
        padding-left:20px;
        text-align: left;
    }
</style>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12">
            <form class="form-inline">
                <div class="form-group">
                    <label class="sr-only" for="exampleInputAmount">搜索</label>
                    <div class="input-group">
                        <div class="input-group-addon"><span class="iconfont icon-search"></span></div>
                        <input type="text" class="form-control" id="exampleInputAmount" placeholder="搜索资料">
                        <div class="input-group-addon"></div>
                    </div>
                </div>
            </form>
        </div>

        <div class="col-md-12">

            <div class="course-list" style="margin-top: 10px;">
                <div class="js-course-list">
                    <ul id="list-content" class="list-unstyled">


                        <li><a href="/view/342">
                                <div class="course-list-img"><img width="280" height="160" alt="C++远征之起航篇"
                                                                  src="http://img.mukewang.com/550b86560001009406000338-300-170.jpg">
                                </div>
                                <h5><span>C++远征之起航篇</span></h5>

                                <div class="intro"><p>C++亮点尽在其中</p><span class="l new">更新至5-1</span> <span class="r">课程时长：1小时0分</span>
                                </div>
                                <div class="tips"><span class="l new">45分钟前更新</span> <span class="r">47人学习</span></div>
                            </a></li>
                        <li><a href="/view/352">
                                <div class="course-list-img"><img width="280" height="160" alt="细说Java多线程之内存可见性"
                                                                  src="http://img.mukewang.com/5518c3d7000175af06000338-300-170.jpg">
                                </div>
                                <h5><span>细说Java多线程之内存可见性</span></h5>

                                <div class="intro"><p>用两种方式实现内存可见性
                                    </p><span class="l new">更新至5-1</span> <span class="r">课程时长：1小时0分</span></div>
                                <div class="tips"><span class="l new">3小时前更新</span> <span class="r">126人学习</span></div>
                            </a></li>
                        <li><a href="/view/355">
                                <div class="course-list-img"><img width="280" height="160" alt="Tony老师聊shell——运算符"
                                                                  src="http://img.mukewang.com/551916790001125706000338-300-170.jpg">
                                </div>
                                <h5><span>Tony老师聊shell——运算符</span></h5>

                                <div class="intro"><p>Tony为你带来shell编程中的运算符！</p><span class="l new">更新至3-1</span> <span
                                            class="r">课程时长：45分</span></div>
                                <div class="tips"><span class="l new">20小时前更新</span> <span class="r">462人学习</span></div>
                            </a></li>
                        <li><a href="/view/350">
                                <div class="course-list-img"><img width="280" height="160" alt="鬼斧神工之正则表达式"
                                                                  src="http://img.mukewang.com/5518bbe30001c32006000338-300-170.jpg">
                                </div>
                                <h5><span>鬼斧神工之正则表达式</span></h5>

                                <div class="intro"><p>正则表达式是计算机编程语言界的鬼斧神工。</p><span class="l">更新至3-11</span> <span
                                            class="r">课程时长：2小时10分</span></div>
                                <div class="tips"><span class="l">1天前更新</span> <span class="r">2231人学习</span></div>
                            </a></li>
                        <li><a href="/view/347">
                                <div class="course-list-img"><img width="280" height="160" alt="如何使用高德JS-API进行基于LBS的开发"
                                                                  src="http://img.mukewang.com/5513a1b50001752806000338-300-170.jpg">
                                </div>
                                <h5><span>如何使用高德JS-API进行基于LBS的开发</span></h5>

                                <div class="intro"><p>教你迅速用高德JS-API进行基于LBS的开发</p><span class="l">更新至6-1</span> <span
                                            class="r">课程时长：1小时38分</span></div>
                                <div class="tips"><span class="l">2天前更新</span> <span class="r">531人学习</span></div>
                            </a></li>
                        <li><a href="/view/349">
                                <div class="course-list-img"><img width="280" height="160" alt="Duang~MySQLi扩展库来袭"
                                                                  src="http://img.mukewang.com/5513e20600017c1806000338-300-170.jpg">
                                </div>
                                <h5><span>Duang~MySQLi扩展库来袭</span></h5>

                                <div class="intro"><p>Duang~一起开启MySQLi的学习之旅吧!</p><span class="l">更新至5-3</span> <span
                                            class="r">课程时长：2小时56分</span></div>
                                <div class="tips"><span class="l">2天前更新</span> <span class="r">635人学习</span></div>
                            </a></li>
                        <li><a href="/view/239">
                                <div class="course-list-img"><img width="280" height="160" alt="打造个性的图片预览与多点触控"
                                                                  src="http://img.mukewang.com/546c0d940001f49e06000338-300-170.jpg">
                                </div>
                                <h5><span>打造个性的图片预览与多点触控</span></h5>

                                <div class="intro"><p>学习如何实现图片自由缩放与多点触控效果</p><span class="l">共6章13节</span> <span
                                            class="r">课程时长：1小时54分</span></div>
                                <div class="tips"><span class="l">更新完毕</span> <span class="r">2615人学习</span></div>
                            </a></li>
                        <li><a href="/view/338">
                                <div class="course-list-img"><img width="280" height="160" alt="canvas实现星星闪烁特效"
                                                                  src="http://img.mukewang.com/550a33b00001738a06000338-300-170.jpg">
                                </div>
                                <h5><span>canvas实现星星闪烁特效</span></h5>

                                <div class="intro"><p>使用HTML5实现轮播图片上的序列帧。</p><span class="l">更新至3-2</span> <span
                                            class="r">课程时长：1小时0分</span></div>
                                <div class="tips"><span class="l">6天前更新</span> <span class="r">4150人学习</span></div>
                            </a></li>
                        <li><a href="/view/61">
                                <div class="course-list-img"><img width="280" height="160" alt="用less写个新浪微博"
                                                                  src="http://img.mukewang.com/54816db200011c6806000338-300-170.jpg">
                                </div>
                                <h5><span>用less写个新浪微博</span></h5>

                                <div class="intro"><p>用less构建新浪微博的个人主页。</p><span class="l">更新至3-1</span> <span
                                            class="r">课程时长：1小时30分</span></div>
                                <div class="tips"><span class="l">2015-03-25更新</span> <span class="r">4228人学习</span>
                                </div>
                            </a></li>
                        <li><a href="/view/340">
                                <div class="course-list-img"><img width="280" height="160" alt="高德地图组件快速入门"
                                                                  src="http://img.mukewang.com/550a836c0001236606000338-300-170.jpg">
                                </div>
                                <h5><span>高德地图组件快速入门</span></h5>

                                <div class="intro"><p>教你迅速使用地图组件进行基于LBS的开发</p><span class="l">更新至1-1</span> <span
                                            class="r">课程时长：17分</span></div>
                                <div class="tips"><span class="l">2015-03-24更新</span> <span class="r">2464人学习</span>
                                </div>
                            </a></li>
                        <li><a href="/view/341">
                                <div class="course-list-img"><img width="280" height="160" alt="如何使用高德定位进行开发"
                                                                  src="http://img.mukewang.com/550a87da000168db06000338-300-170.jpg">
                                </div>
                                <h5><span>如何使用高德定位进行开发</span></h5>

                                <div class="intro"><p>教你迅速使用定位进行基于LBS的开发</p><span class="l">更新至3-1</span> <span
                                            class="r">课程时长：1小时4分</span></div>
                                <div class="tips"><span class="l">2015-03-24更新</span> <span class="r">1682人学习</span>
                                </div>
                            </a></li>
                        <li><a href="/view/344">
                                <div class="course-list-img"><img width="280" height="160" alt="Linux系统扫描技术及安全防范"
                                                                  src="http://img.mukewang.com/5510c2c500016e9e06000338-300-170.jpg">
                                </div>
                                <h5><span>Linux系统扫描技术及安全防范</span></h5>

                                <div class="intro"><p>在Linux系统下实现系统扫描及安全防范。</p><span class="l">共7章20节</span> <span
                                            class="r">课程时长：1小时41分</span></div>
                                <div class="tips"><span class="l">更新完毕</span> <span class="r">2542人学习</span></div>
                            </a></li>
                        <li><a href="/view/343">
                                <div class="course-list-img"><img width="280" height="160"
                                                                  alt="Android图像处理-变&quot;换&quot;莫测的图像"
                                                                  src="http://img.mukewang.com/551a15d80001574406000338-300-170.jpg">
                                </div>
                                <h5><span>Android图像处理-变"换"莫..</span></h5>

                                <div class="intro"><p>了解Android中对图像变形的分析与处理</p><span class="l">共5章10节</span> <span
                                            class="r">课程时长：2小时8分</span></div>
                                <div class="tips"><span class="l">更新完毕</span> <span class="r">2563人学习</span></div>
                            </a></li>
                        <li><a href="/view/337">
                                <div class="course-list-img"><img width="280" height="160" alt="Oracle数据库开发必备利器之SQL基础"
                                                                  src="http://img.mukewang.com/55063fc600019d0006000338-300-170.jpg">
                                </div>
                                <h5><span>Oracle数据库开发必备利器之SQL基础</span></h5>

                                <div class="intro"><p>为你带来Oracle数据库开发必备的sql基础。</p><span class="l new">更新至7-1</span>
                                    <span class="r">课程时长：4小时0分</span></div>
                                <div class="tips"><span class="l new">18小时前更新</span> <span class="r">4490人学习</span>
                                </div>
                            </a></li>
                        <li><a href="/view/336">
                                <div class="course-list-img"><img width="280" height="160" alt="shell编程基础之变量"
                                                                  src="http://img.mukewang.com/55063ec30001774b06000338-300-170.jpg">
                                </div>
                                <h5><span>shell编程基础之变量</span></h5>

                                <div class="intro"><p>Tony老师为您带来shell编程基础中的变量！</p><span class="l">共2章7节</span> <span
                                            class="r">课程时长：1小时50分</span></div>
                                <div class="tips"><span class="l">更新完毕</span> <span class="r">4640人学习</span></div>
                            </a></li>
                        <li><a href="/view/333">
                                <div class="course-list-img"><img width="280" height="160" alt="快乐的sublime编辑器"
                                                                  src="http://img.mukewang.com/5502bbdd0001a8a606000338-300-170.jpg">
                                </div>
                                <h5><span>快乐的sublime编辑器</span></h5>

                                <div class="intro"><p>展示sublimeText,讲透它的使用哲学。</p><span class="l">更新至13-1</span> <span
                                            class="r">课程时长：1小时1分</span></div>
                                <div class="tips"><span class="l">2天前更新</span> <span class="r">11488人学习</span></div>
                            </a></li>
                        <li><a href="/view/302">
                                <div class="course-list-img"><img width="280" height="160" alt="Android图像处理-打造美图秀秀从它开始"
                                                                  src="http://img.mukewang.com/54bf7e1f000109c506000338-300-170.jpg">
                                </div>
                                <h5><span>Android图像处理-打造美图秀秀从它开始</span></h5>

                                <div class="intro"><p>了解Android中对图像色彩的分析与处理</p><span class="l">更新至3-3</span> <span
                                            class="r">课程时长：2小时0分</span></div>
                                <div class="tips"><span class="l">2015-03-13更新</span> <span class="r">5042人学习</span>
                                </div>
                            </a></li>
                        <li><a href="/view/256">
                                <div class="course-list-img"><img width="280" height="160" alt="CSS深入理解之overflow"
                                                                  src="http://img.mukewang.com/54c1a5880001aa9106000338-300-170.jpg">
                                </div>
                                <h5><span>CSS深入理解之overflow</span></h5>

                                <div class="intro"><p>深入理解overflow相关特性及各类实际应用。</p><span class="l">更新至6-1</span> <span
                                            class="r">课程时长：1小时0分</span></div>
                                <div class="tips"><span class="l">2天前更新</span> <span class="r">5269人学习</span></div>
                            </a></li>
                        <li><a href="/view/331">
                                <div class="course-list-img"><img width="280" height="160" alt="CSS3实现漂亮ToolTips效果"
                                                                  src="http://img.mukewang.com/54f962eb0001640806000338-300-170.jpg">
                                </div>
                                <h5><span>CSS3实现漂亮ToolTips效果</span></h5>

                                <div class="intro"><p>CSS3实现鼠标悬停弹出信息提示框。</p><span class="l">共1章6节</span> <span
                                            class="r">课程时长：1小时20分</span></div>
                                <div class="tips"><span class="l">更新完毕</span> <span class="r">9358人学习</span></div>
                            </a></li>
                        <!--<li><a href="/view/317">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="python进阶"-->
                                                                  <!--src="http://img.mukewang.com/54c886740001b85d06000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>python进阶</span></h5>-->

                                <!--<div class="intro"><p>深入学习Python函数式编程、模块和面向对象编程</p><span class="l">共7章47节</span> <span-->
                                            <!--class="r">课程时长：3小时32分</span></div>-->
                                <!--<div class="tips"><span class="l">更新完毕</span> <span class="r">12001人学习</span></div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/289">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="Java实现数字签名"-->
                                                                  <!--src="http://img.mukewang.com/54af7b720001fde306000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>Java实现数字签名</span></h5>-->

                                <!--<div class="intro"><p>有效保障网络传输过程中的数据安全，多用于金融领域的数据加密。</p><span class="l">更新至5-1</span>-->
                                    <!--<span class="r">课程时长：1小时20分</span></div>-->
                                <!--<div class="tips"><span class="l">2015-02-23更新</span> <span class="r">6593人学习</span>-->
                                <!--</div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/330">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="PHP实现页面静态化"-->
                                                                  <!--src="http://img.mukewang.com/54dc48880001b9f306000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>PHP实现页面静态化</span></h5>-->

                                <!--<div class="intro"><p>网站开发必备技能—页面静态化。</p><span class="l">更新至3-4</span> <span class="r">课程时长：2小时42分</span>-->
                                <!--</div>-->
                                <!--<div class="tips"><span class="l">2015-02-13更新</span> <span class="r">10765人学习</span>-->
                                <!--</div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/329">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="GD库实现图片水印与缩略图"-->
                                                                  <!--src="http://img.mukewang.com/54dc11560001468e06000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>GD库实现图片水印与缩略图</span></h5>-->

                                <!--<div class="intro"><p>带你快速高效的完成图片处理工作。</p><span class="l">更新至5-3</span> <span class="r">课程时长：1小时41分</span>-->
                                <!--</div>-->
                                <!--<div class="tips"><span class="l">2015-02-13更新</span> <span class="r">3843人学习</span>-->
                                <!--</div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/332">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="肾六的分分合合"-->
                                                                  <!--src="http://img.mukewang.com/54dd85d40001fe3506000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>肾六的分分合合</span></h5>-->

                                <!--<div class="intro"><p>准备进入手术室摘除肾6</p><span class="l">更新至2-1</span> <span class="r">课程时长：36分</span>-->
                                <!--</div>-->
                                <!--<div class="tips"><span class="l">2015-02-13更新</span> <span class="r">11477人学习</span>-->
                                <!--</div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/248">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="Linux C语言编程基本原理与实践"-->
                                                                  <!--src="http://img.mukewang.com/54db0bfc0001946006000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>Linux C语言编程基本原理与实践</span></h5>-->

                                <!--<div class="intro"><p>C—最强编程语言的编程本质。</p><span class="l">共9章13节</span> <span class="r">课程时长：2小时0分</span>-->
                                <!--</div>-->
                                <!--<div class="tips"><span class="l">更新完毕</span> <span class="r">13591人学习</span></div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/288">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="JAVA实现非对称加密"-->
                                                                  <!--src="http://img.mukewang.com/54af7b060001f1c606000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>JAVA实现非对称加密</span></h5>-->

                                <!--<div class="intro"><p>为你带来安全、应用广泛的非对称加密算法在JAVA中的实现。</p><span class="l">更新至4-1</span>-->
                                    <!--<span class="r">课程时长：1小时20分</span></div>-->
                                <!--<div class="tips"><span class="l">2015-02-12更新</span> <span class="r">3530人学习</span>-->
                                <!--</div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/300">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="Android实现卫星菜单"-->
                                                                  <!--src="http://img.mukewang.com/54bf7d960001858806000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>Android实现卫星菜单</span></h5>-->

                                <!--<div class="intro"><p>仿Path的卫星式菜单</p><span class="l">共1章8节</span> <span class="r">课程时长：1小时30分</span>-->
                                <!--</div>-->
                                <!--<div class="tips"><span class="l">更新完毕</span> <span class="r">5184人学习</span></div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/250">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="Ajax全接触"-->
                                                                  <!--src="http://img.mukewang.com/549bda090001c53e06000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>Ajax全接触</span></h5>-->

                                <!--<div class="intro"><p>由浅入深，循序渐进学习Ajax的相关概念、原理、实现方式和应用方法。</p><span-->
                                            <!--class="l">共7章17节</span> <span class="r">课程时长：2小时10分</span></div>-->
                                <!--<div class="tips"><span class="l">更新完毕</span> <span class="r">14449人学习</span></div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/303">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="Android自定义任意层级树形控件"-->
                                                                  <!--src="http://img.mukewang.com/54bf7e5000012a0106000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>Android自定义任意层级树形控件</span></h5>-->

                                <!--<div class="intro"><p>用ListView做的树状图</p><span class="l">共1章9节</span> <span class="r">课程时长：2小时0分</span>-->
                                <!--</div>-->
                                <!--<div class="tips"><span class="l">更新完毕</span> <span class="r">5489人学习</span></div>-->
                            <!--</a></li>-->
                        <!--<li><a href="/view/327">-->
                                <!--<div class="course-list-img"><img width="280" height="160" alt="携程C4技术分享沙龙"-->
                                                                  <!--src="http://img.mukewang.com/54d45f7d0001e8f206000338-300-170.jpg">-->
                                <!--</div>-->
                                <!--<h5><span>携程C4技术分享沙龙</span></h5>-->

                                <!--<div class="intro"><p>来自携程C4技术沙龙的现场分享！</p><span class="l">共4章9节</span> <span class="r">课程时长：2小时50分</span>-->
                                <!--</div>-->
                                <!--<div class="tips"><span class="l">更新完毕</span> <span class="r">5501人学习</span></div>-->
                            <!--</a></li>-->


                    </ul>
                     <div id="loading" class="spinner">
                            <div class="rect1"></div>
                            <div class="rect2"></div>
                            <div class="rect3"></div>
                            <div class="rect4"></div>
                            <div class="rect5"></div>
                        </div>
                </div>
            </div>
        </div>
    </div>
</div>

</body>

<% include basejs.ejs %>
<script src="/js/list.js"></script>
<script src="/js/app.js"></script>
<script>
    $(function() {
//        $('#list-content li').hide();
//
//        setTimeout(function () {
//            $('#loading').hide();
//            $('#list-content li').show();
//        },3000)

        var p="{$other.p}";
        if(p=="") p=1;
        var stop=true;//触发开关，防止多次调用事件
        $(window).scroll(function() {
            //当内容滚动到底部时加载新的内容 100当距离最底部100个像素时开始加载.
            if ($(this).scrollTop() + $(window).height() + 100 >= $(document).height() && $(this).scrollTop() > 100) {

                if(stop==true){
                    stop=false;
                    p=p+1;//当前要加载的页码
                    canshu="?t={$other.t}&p="+p+"&cid={$other.cid}";
                    //加载提示信息
                    $("#showlists").append("<li class='ajaxtips'><div style='font-size:2em'>Loding.....</div></li>");
                    $.get("__URL__/nextpage"+canshu,function(data){
                        $(".ajaxtips").hide();
                        $("#showlists").append(data);//把新的内容加载到内容的后面
                        stop=true;
                    })
                }
            }
        });
    });
</script>
</html>